<template>
  <el-config-provider
    namespace="hi"
    :locale="zhCn"
  >
    <router-view />
  </el-config-provider>
</template>

<script setup lang="ts">
import { onMounted, nextTick } from 'vue';

import { ElConfigProvider } from 'hive-plus';
import zhCn from 'hive-plus/dist/locale/zh-cn.mjs';
import { RouterView } from 'vue-router';

import config from '../app.config';

import { useAppStore } from '@/store/app';
import { setThemeColor, setTextColor } from '@/utils/reset-el-color';
import { SessionStorageService, LocalStorageService } from '@/utils/storage';

const appStore = useAppStore();

onMounted(async () => {
  // 设置自定义的主题色和字体颜色
  setThemeColor(config.themeColors);
  setTextColor(config.textColors);

  // 清除storage中过期的内容
  LocalStorageService.clearExpired();
  SessionStorageService.clearExpired();

  const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
  if (mediaQuery.matches) {
    appStore.changeTheme('dark');
  } else {
    appStore.changeTheme('light');
  }

  nextTick(() => {
    const loadingDom = document.getElementById('MhLoading');
    if (loadingDom) {
      loadingDom.style.display = 'none';
      loadingDom.remove();
    }
  });
});
</script>

<style lang="scss" scoped></style>
